#include("../layout.html")
#@layout("编辑文章")

#define head()
#[[
<style>
    .tagchecklist {
        margin-left: 14px;
        font-size: 12px;
        overflow: auto;
    }
    .tagchecklist>li {
        float: left;
        margin-right: 25px;
        font-size: 13px;
        line-height: 1.8em;
        cursor: default;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-bottom: 6px;
    }
    .tagchecklist .ntdelbutton {
        position: absolute;
        width: 24px;
        height: 24px;
        border: none;
        margin: 0 0 0 -19px;
        padding: 0;
        background: 0 0;
        cursor: pointer;
        text-indent: 0;
    }
    .the-tagcloud {
        margin: 5px 0 10px;
        padding: 8px;
        border: 1px solid #ddd;
        line-height: 1.8em;
        word-spacing: 3px;
    }
    .the-tagcloud ul {
        margin: 0;
    }
    .the-tagcloud ul li {
        display: inline-block;
        margin-bottom: 6px;
    }
    .ui-autocomplete {
        padding: 0;
        margin: 0;
        list-style: none;
        position: absolute;
        z-index: 10000;
        border: 1px solid #5b9dd9;
        box-shadow: 0 1px 2px rgba(30,140,190,.8);
        background-color: #fff;
    }
    .ui-autocomplete li {
        margin-bottom: 0;
        padding: 4px 10px;
        white-space: nowrap;
        text-align: left;
        cursor: pointer
    }
    .ui-autocomplete li:hover {
        background-color: #0073aa;
        color: #fff
    }
    input[type=text].ui-autocomplete-loading {
        background-image: url(/assets/admin/css/images/loading.gif);
        background-size: 20px 20px;
        background-repeat: no-repeat;
        background-position: right center;
        visibility: visible
    }
    #set-post-thumbnail {
        display: inline-block;
        max-width: 100%;
    }
    #set-post-thumbnail img {
        max-width: 100%;
        height: auto;
        width: auto;
        vertical-align: top;
        background-image: linear-gradient(45deg,#c4c4c4 25%,transparent 25%,transparent 75%,#c4c4c4 75%,#c4c4c4),linear-gradient(45deg,#c4c4c4 25%,transparent 25%,transparent 75%,#c4c4c4 75%,#c4c4c4);
        background-position: 0 0, 10px 10px;
        background-size: 20px 20px;
    }
</style>
]]#
#end

#define category(parents, key, depth, selectedCategoryIds)
#for(x : parents[""+key+""])
<li>
    <input type="checkbox" name="category" value="#(x.term_taxonomy_id)" title="#(x.name)" lay-skin="primary" #if(selectedCategoryIds.contains(x.term_id))checked#end>
    #if(null != parents[""+x.term_id+""])
    <ul class="children" style="margin-left:18px;">
        #@category(parents, x.term_id, depth+1, selectedCategoryIds)
    </ul>
    #end
</li>
#end
#end

#define dropdown(parents, key, depth)
#for(x : parents[""+key+""])
<option value="#(x.term_taxonomy_id)">#(java.lang.String::join("", java.util.Collections::nCopies(depth, "— ")) + x.name)</option>
#if(null != parents[""+x.term_id+""])
#@dropdown(parents, x.term_id, depth+1)
#end
#end
#end

#define body()
<h1>编辑文章</h1>

<div class="layui-fluid">
    <form class="layui-form" action="/admin/post/update" method="post">
        <input type="hidden" name="post" value="#(post.ID)"/>
        <input type="hidden" name="post_author" value="#(post.post_author)"/>
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md9">
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md12">
                        <div>
                            <input type="text" name="post_title" required lay-verify="required" placeholder="在此输入标题" autocomplete="off" class="layui-input" value="#(post.post_title)">
                        </div>
                        <div id="edit-slug-box">
                            <strong>固定链接：</strong>
                            <span id="sample-permalink"><a href="http://localhost:8888/?p=#(post.ID)&amp;preview=true" target="wp-preview-#(post.ID)">http://localhost:8888/#(post.post_date)/<span id="editable-post-name">#(post.post_name)</span>/</a></span>
                            <span id="edit-slug-buttons"><a href="/admin/option/permalink" class="layui-btn layui-btn-xs layui-btn-primary">编辑</a></span>
                            <span id="editable-post-name-full">#(post.post_name)</span>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md12">
                        <div class="layui-tab">
                            <ul class="layui-tab-title" style="text-align:right;border-bottom:none;">
                                <li class="layui-this">可视化</li>
                                <!-- <li>文本</li> -->
                            </ul>
                            <div class="layui-tab-content" style="padding:0;">
                                <div class="layui-tab-item layui-show">
                                    <textarea id="tiny" name="post_content">#(post.post_content)</textarea>
                                </div>
                                <!-- <div class="layui-tab-item">
                                    <textarea id="layui" placeholder="请输入内容" class="layui-textarea layui-edit" style="height: 350px;">#(post.post_content)</textarea>
                                </div> -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-col-md3">
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md12">
                        <div class="layui-card">
                            <div class="layui-card-header">发布</div>
                            <div class="layui-card-body">
                                <div id="minor-publishing-actions">
                                    <div id="save-action">
                                        <button id="save-post" class="layui-btn layui-btn-sm layui-btn-primary">保存草稿</button>
                                    </div>
                                    <div id="preview-action">
                                        <button id="post-preview" class="layui-btn layui-btn-sm layui-btn-primary">预览</button>
                                    </div>
                                    <div class="layui-clear"></div>
                                </div>
                                <div id="misc-publishing-actions">
                                    <div class="misc-pub-section layui-icon layui-icon-flag" style="font-size:13px;">
                                        <span>状态：</span>
                                        <span id="post-status-display">
											#if(post.post_status == "publish")
												已发布
											#else if(post.post_status == "draft")
												草稿
											#else if(post.post_status == "pending")
												等待复审
											#else if(post.post_status == "trash")
												回收站
											#end
										</span>
                                        <a href="#post_status" class="edit-post-status">编辑</a>
                                        <div id="post-status-select" style="display: none;">
                                            <input type="hidden" id="hidden_post_status" value="#(post.post_status)">
                                            <div class="layui-inline" style="width:100px;">
                                                <label for="post_status" class="screen-reader-text">设置状态</label>
                                                <select name="post_status" id="post_status">
                                                    <option value="publish" #if(post.post_status == "publish")selected#end>已发布</option>
                                                    <option value="pending" #if(post.post_status == "pending")selected#end>等待复审</option>
                                                    <option value="draft" #if(post.post_status == "draft")selected#end>草稿</option>
                                                </select>
                                            </div>
                                            <a href="#post_status" class="save-post-status layui-btn layui-btn-sm layui-btn-primary">确定</a>
                                            <a href="#post_status" class="cancel-post-status layui-btn layui-btn-sm layui-btn-primary" style="border:0;color:#0073aa;padding:0 2px;text-decoration:underline;">取消</a>
                                        </div>
                                    </div>
                                    <div class="misc-pub-section layui-icon layui-icon-auz" style="font-size:13px;">
                                        <span>公开度：</span>
                                        <span id="post-visibility-display">
											#if(post.post_password && post.post_password != "")
												密码保护
											#else
												公开
											#end
										</span>
                                        <a href="#visibility" class="edit-visibility">编辑</a>
                                        <div id="post-visibility-select" style="display: none;">
                                            <input type="hidden" id="hidden-post-password" value="#(post.post_password)">
                                            <input type="hidden" id="hidden-post-sticky" value="#if(post.sticky)sticky#end">
                                            <input type="hidden" id="hidden-post-visibility" value="#if(post.post_password && post.post_password != '')password#else public#end">

                                            <input type="radio" name="visibility" id="visibility-radio-public" value="public" #if(!post.post_password || post.post_password == "")checked="checked"#end title="公开" lay-filter="visibility"><br>
                                            <span id="sticky-span" style="margin-left:18px;#if(post.post_password && post.post_password != '')display:none;#end">
												<input id="sticky" name="sticky" type="checkbox" value="true" title="将文章置于首页顶端" lay-skin="primary" #if(post.sticky)checked#end><br>
											</span>

                                            <input type="radio" name="visibility" id="visibility-radio-password" value="password" #if(post.post_password && post.post_password != "")checked="checked"#end title="密码保护" lay-filter="visibility"><br>
                                            <span id="password-span" #if(!post.post_password || post.post_password == "")style="display: none;"#end>
                                            <label for="post_password">密码：</label>
                                            <input type="text" name="post_password" id="post_password" value="#(post.post_password)" maxlength="255" class="layui-input">
                                            </span>

                                            <input type="radio" name="visibility" id="visibility-radio-private" value="private" title="私密" lay-filter="visibility"><br>

                                            <div class="layui-inline">
                                                <a href="#visibility" class="save-post-visibility layui-btn layui-btn-sm layui-btn-primary">确定</a>
                                                <a href="#visibility" class="cancel-post-visibility layui-btn layui-btn-sm layui-btn-primary" style="border:0;color:#0073aa;padding:0 2px;text-decoration:underline;">取消</a>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="misc-pub-section layui-icon layui-icon-date" style="font-size:13px;">
                                        <span></span>
                                        <span id="timestamp-display">#date(post.post_date, 'yyyy-MM-dd HH:mm:ss')</span>
                                        <a href="#edit_timestamp" class="edit-timestamp">编辑</a>
                                        <div id="timestampdiv" style="display: none;margin:0;padding:0;">
                                            <div class="timestamp-wrap">
                                                <input type="text" name="post_date" id="post_date" value="#date(post.post_date, 'yyyy-MM-dd HH:mm:ss')" class="layui-input">
                                            </div>

                                            <div style="margin: 8px 0 0;">
                                                <a href="#edit_timestamp" class="save-timestamp layui-btn layui-btn-sm layui-btn-primary">确定</a>
                                                <a href="#edit_timestamp" class="cancel-timestamp layui-btn layui-btn-sm layui-btn-primary" style="border:0;color:#0073aa;padding:0 2px;text-decoration:underline;">取消</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="major-publishing-actions">
                                    <div id="delete-action">
                                        <a href="javascript:;" onclick="layui.post.trash(#(post.ID))">移至回收站</a>
                                    </div>
                                    <div id="publishing-action">
                                        <button id="publish" type="submit" lay-submit lay-filter="*" class="layui-btn layui-btn-sm">更新</button>
                                    </div>
                                    <div class="layui-clear"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md12">
                        <div class="layui-card">
                            <div class="layui-card-header">形式</div>
                            <div class="layui-card-body layui-form">
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="0" title="标准" #if(!post.format || post.format == "0")checked#end>
                                </div>
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="aside" title="日志" #if(post.format == "aside")checked#end>
                                </div>
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="image" title="图像" #if(post.format == "image")checked#end>
                                </div>
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="video" title="视频" #if(post.format == "video")checked#end>
                                </div>
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="quote" title="引语" #if(post.format == "quote")checked#end>
                                </div>
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="link" title="链接" #if(post.format == "link")checked#end>
                                </div>
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="gallery" title="相册" #if(post.format == "gallery")checked#end>
                                </div>
                                <div class="layui-block">
                                    <input type="radio" name="post_format" value="audio" title="音频" #if(post.format == "audio")checked#end>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md12">
                        <div class="layui-card">
                            <div class="layui-card-header">分类目录</div>
                            <div class="layui-card-body layui-form">
                                <div class="layui-tab">
                                    <ul class="layui-tab-title">
                                        <li class="layui-this">所有分类目录</li>
                                        <li>最多使用</li>
                                    </ul>
                                    <div class="layui-tab-content" style="border: 1px solid #e6e6e6;border-top: none;padding: 10px;">
                                        <div class="layui-tab-item layui-show">
                                            <ul>
                                                #@category(categories, 0, 0, selectedCategoryIds)
                                                <!-- <li><input type="checkbox" name="" title="未分类" lay-skin="primary"></li> -->
                                            </ul>
                                        </div>
                                        <div class="layui-tab-item">
                                            <ul>
                                                <li><input type="checkbox" name="" title="未分类" lay-skin="primary"></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div>
                                    <a href="javascript:;" id="category-add-toggle" style="margin: 10px 0;"> + 添加新分类目录 </a>
                                    <p id="category-add" class="category-add" style="display: none; margin: 1em 0;">
                                        <label class="screen-reader-text" for="newcategory">添加新分类目录</label>
                                        <input type="text" id="newcategory" class="layui-input" value="新分类目录名" style="margin: 0 0 1em;">
                                        <label class="screen-reader-text" for="newcategory_parent">父级分类目录：</label>
                                        <select id="newcategory_parent">
                                            #@dropdown(categories, 0, 0)
                                        </select>
                                        <input type="button" id="category-add-submit" class="layui-btn layui-btn-sm layui-btn-primary" value="添加新分类目录" style="margin: 1em 0 0;">
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md12">
                        <div class="layui-card">
                            <div class="layui-card-header">标签</div>
                            <div class="layui-card-body">
                                <div style="display: none;">
                                    <label for="tax-input-post_tag">添加或删除标签</label>
                                    <p><textarea name="tax_tag" id="tax-tag-post_tag">#for(tag : post.tags)#(tag.name)、#end</textarea></p>
                                </div>
                                <div>
                                    <div class="layui-inline" style="width:176px;position:relative;">
                                        <input id="new-tag-post_tag" type="text" name="new_tag" placeholder="" autocomplete="off" class="layui-input" style="height:30px;">
                                        <ul class="ui-autocomplete" id="taglist" style="display: none;width:178px;top:34px;">
                                        </ul>
                                    </div>
                                    <div class="layui-inline">
                                        <button type="button" id="tagadd" class="layui-btn layui-btn-sm layui-btn-primary">添加</button>
                                    </div>
                                    <p style="margin: 6px 0;">多个标签请用英文逗号（,）分开</p>
                                    <ul class="tagchecklist">
                                        #for(tag : post.tags)
                                        <li data="#(tag.name)">
                                            <button type="button" class="ntdelbutton">
                                                <span class="layui-icon layui-icon-close-fill" style="color:#0073aa;"></span>
                                                <span class="screen-reader-text">移除项目：#(tag.name)</span>
                                            </button>
                                            &nbsp;#(tag.name)
                                        </li>
                                        #end
                                    </ul>
                                </div>

                                <div>
                                    <a href="javascript:;" id="link-post_tag"> 从常用标签中选择 </a>
                                    <div id="tagcloud-post_tag" class="the-tagcloud" style="display: none;">
                                        <ul class="wp-tag-cloud" role="list">
                                            <li><a href="#" role="button" class="tag-cloud-link tag-link-34 tag-link-position-1" style="font-size: 8pt;" aria-label="bbbb (1个项目)">bbbb</a></li>
                                            <li><a href="#" role="button" class="tag-cloud-link tag-link-36 tag-link-position-2" style="font-size: 8pt;" aria-label="bbbbbbbb (1个项目)">bbbbbbbb</a></li>
                                            <li><a href="#" role="button" class="tag-cloud-link tag-link-37 tag-link-position-3" style="font-size: 8pt;" aria-label="ccccccc (1个项目)">ccccccc</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md12">
                        <div class="layui-card">
                            <div class="layui-card-header">特色图片</div>
                            <div class="layui-card-body">
                                <p class="hide-if-no-js">
                                    <a href="" id="set-post-thumbnail" class="thickbox">
                                        #if(post.thumbnail)
                                        <img width="150" height="150" src="#(post.thumbnail.url)" alt="#(post.thumbnail.alt)">
                                        #else
                                        <img width="150" height="150" src="http://localhost:8888/wp-content/uploads/2019/03/avatar.jpg" alt="">
                                        #end
                                    </a>
                                </p>
                                <p class="hide-if-no-js howto" id="set-post-thumbnail-desc">点击图片来修改或更新</p>
                                <div>
                                    <a href="javascript:;" id="set-post-thumbnail"> 设置特色图片 </a>
                                </div>
                                <input type="hidden" id="_thumbnail_id" name="_thumbnail_id" value="#if(post.thumbnail)#(post.thumbnail.id)#end">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>
#end

#define foot()
<script src='/assets/tinymce/tinymce.min.js'></script>
<script>
    layui.cache.page = 'post';
    layui.use(['laydate', 'tbynet'], function(){
        var $ = layui.$;
        var laydate = layui.laydate;
        var tbynet = layui.tbynet;

        tinymce.init({
            selector: '#tiny',
            language: 'zh_CN',
            branding: false,
            height: 400,
            image_title: true,
            automatic_uploads: true,
            file_picker_types: 'file image media',
            file_picker_callback: function(callback, value, meta) {
                var input = document.createElement('input');
                input.setAttribute('type', 'file');
                input.setAttribute('accept', 'image/*');

                input.onchange = function () {
                      var file = this.files[0];

                      var reader = new FileReader();
                      reader.onload = function () {

                        var id = 'blobid' + (new Date()).getTime();
                        var blobCache =  tinymce.activeEditor.editorUpload.blobCache;
                        var base64 = reader.result.split(',')[1];
                        var blobInfo = blobCache.create(id, file, base64);
                        blobCache.add(blobInfo);

                        callback(blobInfo.blobUri(), { title: file.name });
                      };
                      reader.readAsDataURL(file);
                };

                input.click();
            },
            plugins: [
              'advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker',
              'searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking',
              'save table contextmenu directionality emoticons template paste textcolor'
            ],
            toolbar: 'styleselect | bold italic forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | blockquote link image media | preview fullscreen'
        });
        tinymce.activeEditor.on('focus', function(e) {
            $('#tiny').val(tinymce.activeEditor.getContent());
        });
        tinymce.activeEditor.on('blur', function(e) {
            $('#tiny').val(tinymce.activeEditor.getContent());
        });

        //加载编辑器
          /* tbynet.layEditor({
              elem: '#layui'
              ,upload: {
                  url: '/admin/upload'
                  ,size: 3
              }
          }); */

          laydate.render({
              elem: '#post_date' //指定元素
              ,type: 'datetime'
          });

    });
</script>
#end